import { mapValues, without } from 'lodash-es'

export interface CommonComponentProps {
  actionType: string
  url: string
  height: string
  width: string
  paddingLeft: string
  paddingRight: string
  paddingTop: string
  paddingBottom: string
  borderStype: string
  borderColor: string
  borderWidth: string
  borderRadius: string
  boxShadow: string
  opacity: string
  position: string
  left: string
  right: string
  top: string
  bottom: string
}

export interface TextComponentProps extends CommonComponentProps {
  text: string
  fontSize: string
  fontFamily: string
  fontWeight: string
  fontStyle: string
  textDecoration: string
  lineHeight: string
  textAlign: string
  color: string
  backgroundColor: string
}
export interface ImageComponentProps extends CommonComponentProps {
  src: string
}

export const commonDefaultProps: CommonComponentProps = {
  // acticons
  actionType: '',
  url: '',
  // size
  height: '',
  width: '318px',
  paddingLeft: '0px',
  paddingRight: '0px',
  paddingTop: '0px',
  paddingBottom: '0px',
  // border type
  borderStype: 'none',
  borderColor: '#000',
  borderWidth: '0',
  borderRadius: '0',
  //   shadow and opacity
  boxShadow: '0 0 0 #000',
  opacity: '1',
  //   pposition
  position: 'absolute',
  left: '0',
  right: '0',
  top: '0',
  bottom: '0'
}
export const textDefaultProps: TextComponentProps = {
  // basic props - font styles
  text: '正文内容',
  fontSize: '14px',
  fontFamily: '',
  fontWeight: 'normal',
  fontStyle: 'normal',
  textDecoration: 'none',
  lineHeight: '1',
  textAlign: 'left',
  color: '#000',
  backgroundColor: '',
  ...commonDefaultProps
}
export const imageDefaultProps: ImageComponentProps = {
  src: 'test.url',
  ...commonDefaultProps
}

export const textStylePropNames = without(
  Object.keys(textDefaultProps),
  'actionType',
  'url',
  'text'
)
export const imageStylePropNames = without(Object.keys(textDefaultProps), 'url')

export const transfromToComponentProps = <T extends {}>(props: T) => {
  return mapValues(props, (item) => {
    return {
      type: String,
      default: item
    }
  })
}
